<template>
  <div id="app">
    <router-view />
    <theme-picker />
  </div>
</template>

<script>
import ThemePicker from "@/components/ThemePicker";

export default {
  name: "App",
  components: { ThemePicker },
    metaInfo() {
        return {
            title: this.$store.state.settings.dynamicTitle && this.$store.state.settings.title,
            titleTemplate: title => {
                return title ? `${title} - ${process.env.VUE_APP_TITLE}` : process.env.VUE_APP_TITLE
            }
        }
    }
};
</script>
<style lang="scss" scoped>
#app .theme-picker {
  display: none;
}

.render-form{

  .el-input.is-disabled .el-input__inner{
    color: #73777b !important;
  }
  .el-radio__input.is-disabled+span.el-radio__label {
    color: #73777b !important;
  }
  .el-textarea.is-disabled .el-textarea__inner {
    color: #73777b !important;
  }


  .grid-cell{
    padding: 0!important;
  }
  .el-row {
    padding: 0!important;
    margin: 0 !important;
  }
  .el-form-item {
    width: 100%;
    border: 1px solid #e6eaf3;
    margin: -3px -1px -1px 0;
    display: inline-flex;

    .el-form-item__label {
      background: rgba(242, 244, 249, 0.5);
      font-size: 14px;
      line-height: 1;
      font-weight: 400;
      color: #323232;
      white-space: pre-line;
      box-sizing: border-box;
      border-right: 1px solid #e6eaf3;
      padding: 22px 12px;
      flex-shrink: 0;
    }

    .el-form-item__content {
      display: flex;
      padding: 8px 10px;
      flex: 1;
      box-sizing: border-box;
      margin: 0 !important;
    }

    .el-input-number__decrease {
      bottom: 7px !important;
    }
    .el-form-item__error {
      display: none !important;
    }
  }
  .sub-form-table-column{
    .el-form-item {
      width: 100%;
      border: 0;
      margin: -3px -1px -1px 0;
      display: inline-flex;
    }
  }
}
</style>
